<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>csdn搜索引擎</title>

    <link rel="stylesheet" type="text/css" href="${pagecontext.request.getcontextpath}/static/css/search.css"/>
    <link type="text/css" rel="stylesheet" href="http://cdn.staticfile.org/twitter-bootstrap/3.1.1/css/bootstrap.min.css"/>
    <script type="text/javascript" src="${pagecontext.request.getcontextpath}/static/js/jquery.min.js"></script>
    <script type="text/javascript" src="${pagecontext.request.getcontextpath}/static/js/jqPaginator.js"></script>
    <script type="text/javascript" src="${pagecontext.request.getcontextpath}/static/js/search.js"></script>

</head>
<body style="background-color:#f6f6f6;">

<form id="form1" action="/csdnblog/list" method="post" runat="server">
    <div class="conter">
        <div class="q">
            <div style="margin:20px">
                <input id="txtStr" name="q" type="text" class="text" value="${q}"/>
                <input id="ss" type="button" class="button" value="搜索"/>
            </div>
            <div style=" margin:10px 0px 10px 20px">
                热门搜索：<a name="w" style="font-size: 12px;color:#f01; text-decoration:none; cursor:pointer">1111</a>&nbsp;&nbsp;&nbsp;
                <a name="w" style="font-size: 12px;color:#f01; text-decoration:none; cursor:pointer">java</a>&nbsp;&nbsp;&nbsp;
                <a name="w" style="font-size: 12px;color:#f01; text-decoration:none; cursor:pointer">spring</a>&nbsp;&nbsp;&nbsp;
                <a name="w" style="font-size: 12px;color:#f01; text-decoration:none; cursor:pointer">爬虫</a>&nbsp;&nbsp;&nbsp;
            </div>

            <c:forEach items="${list}" var="blog" varStatus="status">
                <div class="wenti">
                    <div id="q1">${status.index+1} <a href="${blog.url}" target="_blank">${blog.title}</a> ${blog.createtime}</div>
                </div>
            </c:forEach>

        </div>

        <!--提交当前页-->
        <input id="p" name="p" type="hidden" value="${p}"/>
        <!--分页栏-->
        <div id="pagination"/>
    </div>


</form>

<script>

    $(document).ready(function () {
        $("#ss").click(function () {
            $("#form1").submit();
        });

        $("[name=w]").click(function () {
            $("#txtStr").val($(this).text());
            $("#ss").click();
        });
    });


    var currentPage = $('#p').val();
    var totalPage = "${totalPage}";
    $.jqPaginator('#pagination', {
        totalPages: totalPage,
        visiblePages: 10,
        currentPage: currentPage,
        wrapper: '<ul class="pagination"></ul>',
        first: '<li class="first"><a href="javascript:void(0);">first</a></li>',
        prev: '<li class="prev"><a href="javascript:void(0);">prev</a></li>',
        next: '<li class="next"><a href="javascript:void(0);">next</a></li>',
        last: '<li class="last"><a href="javascript:void(0);">last</a></li>',
        page: '<li class="page"><a href="javascript:void(0);">{{page}}</a></li>',
        onPageChange: function (num) {
            if (num != currentPage) {
                $('#p').val(num);
                $("#form1").submit();//提交表单
            }

        }
    });


</script>
</body>
</html>